<!DOCTYPE html>
<html lang="en" xmlns:th="https://www.thymeleaf.org/">
<head>
    <meta charset="UTF-8">
    <title>Hello</title>
    <script th:src="@{/webjars/jquery/3.2.1/dist/jquery.min.js}"></script>
    <script th:src="@{/webjars/bootstrap/4.3.1/js/bootstrap.min.js}">   </script>
    <link rel="stylesheet" th:href="@{/webjars/bootstrap/4.3.1/css/bootstrap.min.css}"/>
    <link type="text/css" rel="stylesheet" th:href="@{/static/css/style.css}">
</head>
<body>
    <p>Hello !!!</p>
    <h1>hello, thymeleaf</h1>
    <img id="img1" alt="看到我说明图片挂了"
         th:src="@{/imgs/a.jpg}" title="帅哥一枚"
         width="10%" height="10%" class="rounded‐circle">
    <button id="btn1" class="btn btn‐info">Click Me!</button>
    <div id="div1"></div>
</body>
<script type="text/javascript">
    $("#btn1").click(function(){
        $("#img1").attr({"src":"[[@{/}]]/imgs/b.jpg",
            "title":"小姐姐一名"});
        let val = $("#div1").html();
        if(val.length == 0)
            $("#div1").html("被点出来了...").css({"color":"silver", "font‐size": "24px"});
    else if(val != '')
            $("#div1").html("");
    });
</script>
</html>